<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CSS3
动画平滑过渡效果
</title>
<link rel="stylesheet" href="css/style.css"/>
</head>
<body>
	<div class="htmleaf-container">
		<div class="container">
			<ul>
				<li>
					<h3>SHAPE </h3>
			<div class="morph img">
				<img  src="img/111.jpg"/>
			</div>
				</li>
				<li>
					<h3>DISPLACEMENT</h3>
			<div class="zoom img">
				<img src="img/222.jpg"/>
			</div>
				</li>
				<li>
				<h3>POSITION</h3>
			<div class="tilt img">
				<img src="img/333.jpg"/>
			</div>
				</li>
				<li>
				<h3>COLOR</h3>
			<div class="color img">
				<img src="img/444.png"/>
			</div>
				</li>
			</ul>
		<div class="clear"> </div>
		</div>
	</div>
</body>
</html>